I have some troubles with Async functions.
This is not the same as : This question

I'll do my best to explain. So I try to retrieve data from a Firebase Database.
I can upload data to the database without any problem. I can retrieve them too.

"So where is your issue ?" - probably you behind your screen

My issue is showing the data I retrieve from the database. Here is some code :

const [messages,setMessages] = useState<Message[]>([]);

  useIonViewWillEnter(() => {
    const msgs = getMessagesFromDB().then((data)=>{
      setMessages(data);
    });
   setBusy(false)
 });

And on another file :

export const getMessagesFromDB = async () : Promise<Message[]> => {
    const ref = await firebase.default.database().ref('message');
    try{
        ref.on('value', (snapshot) => {
            const data = snapshot.val();
            const current : Message = data['-Mv4-nZYSk9PoE_cwkWw'][0];
           
            setMessages(current);
            return current;
        });
    }catch (e) {
        throw e; 
    }
    return getMessages();
    
};

Here is my issue, if I do a console.log(data), I see my data from the database.
But I use messages on my page, and nothing show up:

 {busy ? <IonSpinner/> :  messages.map(m => <MessageListItem key={m.id} message={m} />)}

Do you know how can I wait for data ?